<template>
  <div>
    <el-dialog
      title="文档目录授权"
      v-model="showDialog"
      :before-close="close"
      width="1000px"
      top="70px"
      append-to-body
    >
      <DocumentCategory
        ref="groupRef"
        :groupList="groupList"
        :groupTree="groupTree"
        :groupTreeCheck="groupTreeCheck"
        @checkChange="_checkChange"
      ></DocumentCategory>
      <div class="dialog-footer">
        <el-button
          type="primary"
          size="small"
          @click="
            () => {
              emits('submit')
            }
          "
        >
          保存
        </el-button>
        <el-button size="small" @click="close">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script setup name="docCateDialog">
import DocumentCategory from './documentCategory.vue'

const props = defineProps({
  open: {
    type: Boolean,
    default: false,
  },
  groupList: {
    type: Array,
    default: () => {
      return []
    },
  },
  groupTree: {
    type: Array,
    default: () => {
      return []
    },
  },
  groupTreeCheck: {
    type: Array,
    default: () => {
      return []
    },
  },
})
const emits = defineEmits(['submit', 'close', 'editPerson'])
const showDialog = computed({
  get() {
    return props.open
  },
  set(val) {
    emits('update:open', val)
  },
})

function close() {
  emits('close')
}
const _officer = computed(() => {
  return props.officer
})
function _checkChange(checkedNodes) {
  emits('checkChange', checkedNodes)
}
function confirmBtnPerson(val) {
  emits('editPerson', val)
}
</script>

<style scoped>
.dialog-footer {
  display: flex;
  justify-content: flex-end;
  margin: 45px 0 0 0;
}
</style>
